<template>
  <y-dialog @open="open" @close="emit('close')" width="1000px" append-to-body>
    <el-tabs v-model="activeName" tab-position="left">
      <el-tab-pane label="模板设置" name="template">
        <word-template ref="wordTemplateRef" />
      </el-tab-pane>
      <el-tab-pane label="表格设置" name="matedata">
        <el-form ref="genRef" :model="form" size="default" label-width="180px">
          <el-row>
            <el-col :span="12">
              <el-form-item label="用例标题" prop="hasCaseHeading">
                <y-radio
                  v-model="form.hasCaseHeading"
                  :options="sys_enable_disable"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="测试方法" prop="hasTestMethod">
                <y-radio
                  v-model="form.hasTestMethod"
                  :options="sys_enable_disable"
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="用例名称" prop="hasCaseName">
                <y-radio
                  v-model="form.hasCaseName"
                  :options="sys_enable_disable"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12" v-if="form.hasCaseName === '0'">
              <el-form-item label="将该标题替换为" prop="titleCaseName">
                <el-input
                  v-model="form.titleCaseName"
                  placeholder="请输入内容"
                  clearable
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="模块名称" prop="hasCaseModule">
                <y-radio
                  v-model="form.hasCaseModule"
                  :options="sys_enable_disable"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12" v-if="form.hasCaseModule === '0'">
              <el-form-item label="将该标题替换为" prop="titleCaseModule">
                <el-input
                  v-model="form.titleCaseModule"
                  placeholder="请输入内容"
                  clearable
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="测试说明" prop="hasCaseDesc">
                <y-radio
                  v-model="form.hasCaseDesc"
                  :options="sys_enable_disable"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12" v-if="form.hasCaseDesc === '0'">
              <el-form-item label="将该标题替换为" prop="titleCaseDesc">
                <el-input
                  v-model="form.titleCaseDesc"
                  placeholder="请输入内容"
                  clearable
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="预置条件" prop="hasCasePrec">
                <y-radio
                  v-model="form.hasCasePrec"
                  :options="sys_enable_disable"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12" v-if="form.hasCasePrec === '0'">
              <el-form-item label="将该标题替换为" prop="titleCasePrec">
                <el-input
                  v-model="form.titleCasePrec"
                  placeholder="请输入内容"
                  clearable
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="测试步骤" prop="hasCaseSteps">
                <y-radio
                  v-model="form.hasCaseSteps"
                  :options="sys_enable_disable"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12" v-if="form.hasCaseSteps === '0'">
              <el-form-item label="将该标题替换为" prop="titleCaseSteps">
                <el-input
                  v-model="form.titleCaseSteps"
                  placeholder="请输入内容"
                  clearable
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="预期结果" prop="hasCaseExps">
                <y-radio
                  v-model="form.hasCaseExps"
                  :options="sys_enable_disable"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12" v-if="form.hasCaseExps === '0'">
              <el-form-item label="将该标题替换为" prop="titleCaseExps">
                <el-input
                  v-model="form.titleCaseExps"
                  placeholder="请输入内容"
                  clearable
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="实际结果" prop="hasCaseActuals">
                <y-radio
                  v-model="form.hasCaseActuals"
                  :options="sys_enable_disable"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12" v-if="form.hasCaseActuals === '0'">
              <el-form-item label="将该标题替换为" prop="titleCaseActuals">
                <el-input
                  v-model="form.titleCaseActuals"
                  placeholder="请输入内容"
                  clearable
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="测试结论" prop="hasCaseConclusion">
                <y-radio
                  v-model="form.hasCaseConclusion"
                  :options="sys_enable_disable"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12" v-if="form.hasCaseConclusion === '0'">
              <el-form-item label="将该标题替换为" prop="titleCaseConclusion">
                <el-input
                  v-model="form.titleCaseConclusion"
                  placeholder="请输入内容"
                  clearable
                />
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-tab-pane>
    </el-tabs>

    <template #footer>
      <div class="dialog-footer">
        <el-button type="primary" @click="submit">确定</el-button>
        <el-button type="warning" @click="reset">重置</el-button>
        <el-button @click="emit('close')">取消</el-button>
      </div>
    </template>
  </y-dialog>
</template>

<script setup name="Setting">
import WordTemplate from "./WordTemplate";

const { proxy } = getCurrentInstance();

const emit = defineEmits(["close"]);

const { sys_enable_disable } = proxy.useDict("sys_enable_disable");

const activeName = ref("template");

const data = reactive({
  form: {},
});

const { form } = toRefs(data);

const props = defineProps({
  id: { type: String, default: "" },
});

/** 打开对话框事件 */
function open() {
  reset();
}

/** 重置Form方法 */
function reset() {
  form.value = {
    hasCaseName: "0",
    hasCaseModule: "0",
    hasCaseDesc: "0",
    hasCasePrec: "0",
    hasCaseSteps: "0",
    hasCaseExps: "0",
    hasCaseActuals: "0",
    hasCaseConclusion: "0",
    hasCaseHeading: "0",
    hasTestMethod: "0",
  };
  proxy.resetForm("genRef");
}

/** 提交按钮事件 */
function submit() {
  proxy.$refs["genRef"].validate((valid) => {
    if (valid) {
      try {
        let template = proxy.$refs.wordTemplateRef.currentRow;
        if (template) {
          let url = `tms/testplan/${props.id}/outline/`;
          form.value.template = template;
          let params = form.value;
          let filename = `测试大纲_V${Date.now()}`;
          proxy.download(url, filename, params);
          emit("close");
        } else {
          proxy.$modal.msgWarning("请选择生成模板！");
        }
      } catch (error) {
        console.error("Error in generate outline document:", error);
      }
    }
  });
}
</script>
